import { NodeEventType } from 'cc';
import { _decorator, Component, profiler, Sprite, Label, Tween, Color, Vec3 } from 'cc';
const { ccclass } = _decorator;
@ccclass('NodeExDemo')
export class NodeExDemo extends Component {
    pageFlipState: '正面' | '反面' | '在转' = '正面';
    async start() {
        profiler.hideStats();
        //演示用 tween + skewY + scaleX 实现节点旋转
        this.node.on(NodeEventType.TOUCH_START, () => {
            switch (this.pageFlipState) {
                case '正面':
                    this.pageFlipState = '在转';                     //转动过程中屏蔽点击事件
                    new Tween(this.node.get('Page'))
                        .to(0.2, { skewY: 45, scaleX: 0 })           //从正面转到垂直
                        .to(0.2, { skewY: 0, scaleX: -1 })           //从垂直转到反面
                        .call(() => { this.pageFlipState = '反面'; })//转完恢复点击事件
                        .start();
                    break;
                case '反面':
                    this.pageFlipState = '在转';                     //转动过程中屏蔽点击事件
                    new Tween(this.node.get('Page'))
                        .to(0.2, { skewY: -45, scaleX: 0 })          //从反面转到垂直
                        .to(0.2, { skewY: 0, scaleX: 1 })            //从垂直转到正面
                        .call(() => { this.pageFlipState = '正面'; })//转完恢复点击事件
                        .start();
                    break;
            }
        }, this);
        //get方法获取节点
        let bearNode = this.node.get('Page/Node属性演示/Bear');
        console.log('get获取节点', bearNode);
        //get方法获取组件
        let dogSprite = this.node.get('Page/Node属性演示/Bear', Sprite);
        let titleLabel = this.node.get('Page/Node属性演示/AAA/Title', Label);
        console.log('get获取组件', dogSprite, titleLabel);
        //find查找名称为Title的节点
        let titleArray = this.node.find('Title');
        console.log('find查找名称为Title的节点', titleArray);
        //find查找所有名称以K开头的节点
        let kArray = this.node.find('K', true);
        console.log('find查找所有名称以K开头的节点', kArray);
        //演示直接设置Node属性
        new Tween(bearNode)
            .by(2, { x: 500, y: -300, scaleX: 2, scaleY: 0.5 })
            .by(2, { widthU: -50, heightU: -50, angle: 150 })
            .by(2, { x: -500, y: 300, scaleX: -2, scaleY: -0.5 })
            .by(2, { widthU: 50, heightU: 50, angle: -150 })
            .to(1, { scaleXY: 3, color: new Color(0, 255, 0) })
            .to(1, { scaleXY: 1, color: new Color(255, 255, 255) })
            .union().repeatForever().start();
        //振动无限次，水平振幅10，垂直振幅20
        //调用shakeDogNode.setShake(0)可以停止振动
        let shakeDogNode = this.node.get('Page/节点振动演示/Dog');
        shakeDogNode.setShake(-1, new Vec3(10, 20));
        let colorKunNode = this.node.get('Page/颜色渐变演示/Kun');
        let shakeKunNode = this.node.get('Page/节点振动演示/Kun');
        let shakeRatNode = this.node.get('Page/节点振动演示/Rat');
        this.schedule(() => {
            //2秒内渐变到一个随机颜色，渐变效果会影响所有子节点
            //调用colorKunNode.setColor(3)可以在3秒内恢复初始颜色
            colorKunNode.setColor(2, new Color(Math.random() * 255, Math.random() * 255, Math.random() * 255));
            //振动40次，水平振幅100
            shakeKunNode.setShake(40, new Vec3(100, 0));
            //振动40次，垂直振幅100
            shakeRatNode.setShake(40, new Vec3(0, 100));
        }, 3, 1e8, 1e-4);
        /** setColor和setShake支持异步，例如：
         * await shakeDogNode.setShake(20, new Vec3(10, 20));
         * await shakeDogNode.setColor(2, new Color(255, 0, 0));
         * 先振动20次，然后再变色 */
        //设置opacity改变节点透明度
        let opaKunNode = this.node.get('Page/透明度渐变演示/Kun');
        new Tween(opaKunNode)
            .to(1, { opacity: 50 })
            .to(1, { opacity: 255 })
            .union().repeatForever().start();
    }
}